<!DOCTYPE html>
<!--
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
-->
<html>
    <head>
        <title>A.C Dental</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width">
        <link type="text/css" href="css/skitter.styles.css" media="only screen and (min-width: 801px)" rel="stylesheet" />
        <link type="text/css" href="css/skitter.stylesM.css" media="only screen and (max-width: 800px)" rel="stylesheet" />
        <link type="text/css" href="css/default.css" rel="stylesheet" media="only screen and (min-width: 801px)" />
        <link type="text/css" href="css/defaultM.css" rel="stylesheet" media="only screen and (max-width: 800px)" />
        <link type="text/css" href="css/login.css" media="only screen and (min-width: 801px)" rel="stylesheet" />
                <link type="text/css" href="css/loginM.css" media="only screen and (max-width: 800px)" rel="stylesheet" />
        <script type="text/javascript" src="js/jquery-1.6.3.min.js"></script>
        <script type="text/javascript" src="js/jquery.easing.1.3.js"></script>
        <script type="text/javascript" src="js/jquery.skitter.min.js"></script>
    </head>
    <body background="images/fondo.jpg">
        <script type="text/javascript" language="javascript">
            $(document).ready(function() {
                $(".box_skitter_large").skitter();
            });</script>
        <div id="wrapper">
            <header>
                <div id="arriba">
                    <div id="logo">
                        <a href="index.html"><img src="images/logo.png" width="260" height="130" alt="logo"/></a>
                    </div>
                    <div id="example">
                        <section class="loginform cf">
                            <form name="login" action="loguear.php" method="post" accept-charset="utf-8">
                                <div id="form_row">
                                    <label for="user">INICIAR SESION:  </label>     
                                </div>
                                <div id="form_row">
                                    <ul id="textos">
                                        <li><input type="text" name="user" placeholder="Nombre de usuario" required></li>
                                        <li><input type="password" name="password" placeholder="Contraseña" required></li>
                                        <li> <input id="login" type="submit" value=">"></li>
                                    </ul>
                                </div>   
                                <div id="form_row">
                                    <label for="misspasw"><a href="#">¿Olvido la contraseña?</a></label>
                                </div>
                            </form>
                        </section>
                    </div>
                </div>
                <nav id="MenuInicio">
                    <ul id="iconos">
                        <li id="choose" class="icon"><a href="#" title="Inicio"><img src="images/Home - copia.png" width="25" height="20"/></a></li>
                        <li class="icon"><a href="#" title="Contactenos">CONTACTENOS</a></li>
                        <!--<img src="images/Contact.png" width="30" height="30"/>-->

                    </ul>
                </nav>
                <div class="box_skitter box_skitter_large">
                    <ul>
                        <li>
                            <a href="#swapBarsBack"><img src="images/001.jpg" class="swapBarsBackcut" /></a>
                            <!--  <div class="label_text"><p>cut</p></div>-->
                        </li>
                        <li>
                            <a href="#swapBarsBack"><img src="images/002.jpg" class="swapBarsBack" /></a>
                            <!-- <div class="label_text"><p>swapBlocks</p></div>-->
                        </li>
                        <li>
                            <a href="#swapBarsBack"><img src="images/003.jpg" class="swapBarsBack" /></a>
                            <!--<div class="label_text"><p>swapBarsBack</p></div>-->
                        </li>
                    </ul>
                </div>
            </header>
            <div id="container">
                <aside>
                    <div class="tableContainer">
                        <div class="tableRow">
                            <p><button type="button" onclick="AbrirPagina('#');" title="Haga click en esta opción para crear Citas.">Citas</button></p>
                        </div>
                        <div class="tableRow">
                            <p><button type="button" onclick="AbrirPagina('#');" title="Haga click en esta opción para consultar información sobre nuestro personal.">Personal</button></p>
                        </div>
                        <div class="tableRow">
                            <p><button type="button" onclick="AbrirPagina('#');" title="Haga click en esta opción para consultar información relacionada con los productos que ofrecemos.">Productos</button></p>
                        </div>
                        <div class="tableRow">
                            <p><button type="button" onclick="AbrirPagina('#');" title="Haga click en esta opción para obtener consejos para una mejor salud bucal."> Consejos</button></p>
                        </div>
                    </div>
                </aside>
                <section id="main">
                    <div id="main_content">
                        <article>
                            <header><h2>Servicios</h2></header>
                            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse tincidunt egestas accumsan. Ut dignissim sem at interdum ornare. Suspendisse bibendum nibh sit amet ligula tempus ultrices. Donec fermentum euismod odio, vel vehicula mauris aliquet in. Sed euismod mattis velit. Quisque id leo nulla. Vivamus vulputate lectus a sem elementum aliquet. Vivamus adipiscing rhoncus urna nec viverra. Nullam nunc massa, elementum auctor luctus a, pharetra at nulla. Ut sagittis tellus non rutrum rhoncus. Donec id nisl a quam hendrerit molestie. Suspendisse sollicitudin tristique placerat. Nunc posuere pellentesque sodales. Sed fringilla nulla ac luctus sagittis. Donec placerat lacus vitae est molestie venenatis. Curabitur non leo nec ipsum suscipit lobortis ut ut ligula.
                            Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Fusce nec velit a est congue congue. Suspendisse rhoncus, mi ac vestibulum lobortis, tellus velit pharetra nisl, nec pharetra lorem ipsum nec ante. Ut mollis massa ut dolor tempor, sit amet placerat arcu sagittis. Phasellus accumsan ultricies ipsum, nec vulputate nunc porttitor ac. Praesent adipiscing lectus orci, id feugiat mauris suscipit a. Vivamus arcu felis, viverra at mauris nec, egestas auctor risus. Donec tempus eget erat vitae lobortis. Sed in lobortis odio. Aenean cursus adipiscing urna, et imperdiet justo cursus ac. Donec viverra luctus neque, sit amet consequat felis accumsan nec. Maecenas eget leo a lacus ornare suscipit. Sed suscipit magna vel augue pharetra laoreet. Duis at libero leo.
                        </article>
                        <article>
                            <header><h2>Especialidades</h2></header>
                            Donec faucibus lacinia sodales. Aliquam adipiscing tellus mauris, quis placerat ligula fermentum et. Vivamus dapibus vestibulum leo, a tincidunt sem bibendum non. Quisque feugiat nunc vitae enim aliquet egestas. Vestibulum ut dignissim urna. Nulla pellentesque dolor felis, ut luctus urna tristique ut. Proin nec egestas ligula. Fusce in ornare augue.
                            Sed in malesuada tellus, non egestas turpis. Mauris dolor velit, pharetra vitae congue sed, consequat a erat. Maecenas a nunc quis leo lacinia blandit vestibulum vitae arcu. Maecenas vitae turpis sit amet diam iaculis adipiscing. Nunc dapibus enim sed scelerisque feugiat. Nullam malesuada velit a nibh lacinia imperdiet. Nam quis velit eget ipsum tempus semper. Aenean suscipit vestibulum nulla, at consectetur purus condimentum a. Maecenas vel ipsum ipsum.
                            Nullam et augue eu nibh sollicitudin congue. Maecenas egestas ipsum vel varius adipiscing. Suspendisse scelerisque egestas tellus, gravida euismod lectus congue vel. Phasellus lacinia facilisis aliquet. Cras vitae nunc vestibulum, volutpat felis vitae, vestibulum nibh. Nam vel urna fringilla, vehicula orci sed, dignissim ipsum. Morbi at vehicula erat. Vestibulum mollis purus nec augue condimentum, ac molestie justo rhoncus. Morbi pellentesque semper pellentesque. 
                        </article>
                    </div>
                </section>   
            </div>
            <footer>
                <div id="divA">
                    <div id="Media">
                        <h2>Contacto</h1>
                            <img class="Social" alt="Facebook" src="images/Fb.png" height="40" width="40"/>
                            <img class="Social" alt="Twitter" src="images/Tw.png" height="40" width="40"/>
                            <p>
                                <b>Downtown Phoenix Campus</b></br>
                                402 W. Monroe St. Phoenix, AZ 85003</br>
                                602-253-4550
                            </p>
                    </div>
                    <div id="Horario">
                        <h2>Horario</h1>
                            <p>
                                Abierto de lunes a sábado<br/>
                                Atención días lunes a viernes de 9am a 7pm<br/>
                                Atención sábados de 9am a 3pm<br/><br/><br/><br/><br/>
                            </p>
                            <p>Copyright © 2014 A.C. Dental .All rights reserved.</p>
                    </div>
                </div>
            </footer>
        </div>
    </body>
</html>